<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 数组 对象 函数 引用数据类型，拷贝时得到的是地址而不是数值
        // 字符串、数字是简单数据类型，拷贝时得到的就是数值本身
        let arr1 = [1,2,3,4,5];
        let arr2 = arr1; // 此时还是一个数组，只是多了一个访问路径
        arr2[0] = 1.1;
        // 浅拷贝可能会造成原始数据的意外更新
        console.log(arr1);
        console.log(arr2);

        let obj1 = {name: 'Tom', age: 18};
        let obj2 = obj1;// 此时还是一个对象，只是多了一个访问路径
        obj2.age = 17;
        console.log(obj1);
        console.log(obj2);
        // ES5的解决方案
        let str1 = 'abcd';
        let str2 = str1; // 现在有两个abcd了
        str2 += 'e';
        console.log(str1);
        console.log(str2);
        // 开始深拷贝
        let arr3 = [1,2,3,4,5];
        let arr4 = JSON.parse(JSON.stringify(arr3));
        arr4[0] = 9;
        console.log(arr3);
        console.log(arr4);
        // 解决方法2:遍历数组和对象，生成新的数组或对象，赋值给新的变量
        let json1 = {
            list: [
                {name: 'a', price: 1999},
                {name: 'b', price: 1299},
                {name: 'c', price: 1949},
            ]
        }
        // 解决方法3 借助第三方库完成，例如：https://www.lodashjs.com/docs/lodash.cloneDeep/
    </script>
</body>
</html>